div ng-controller="SearchController"
  section.section.search
    .wrap
      .gem-list__form
        input#gem-search type="search" ng-model="search.name" placeholder="{{gems ? 'Search' : 'Loading components…'}}"

  section.section.gem-list ng-if="search.name"
    .wrap
      = render partial: 'components/list'

article.section.getting-started
  .wrap
    h1.section-header.header.header-beta Getting started
    .grid.grid--line
      .grid__cell.unit-1-2.content
        markdown:
          ## Bundler

          **First, make sure you use bundler >= 1.8.4**

          Add `https://#{Rails.configuration.x.hostname}` as a&nbsp;new gem source, then reference any Bower components that you need as gems in the&nbsp;following&nbsp;convention:

              source 'https://#{Rails.configuration.x.hostname}' do
                gem 'rails-assets-BOWER_PACKAGE_NAME'
              end

          [For added security](http://collectiveidea.com/blog/archives/2016/10/06/bundlers-multiple-source-security-vulnerability/) use a block instead of global source for Rubygems too.

          In development, if you have issues with SSL certificates and security is not a priority, you can use the alternate endpoint `http://insecure.rails-assets.org` instead.

          During `bundle` `install`, if Bundler requests a&nbsp;package like this, Rails Assets’ daemon automatically&nbsp;will:

          * fetch the component from Bower’s&nbsp;registry,
          * analyze its manifest file, `bower.json`,
          * repackage the component as a&nbsp;valid&nbsp;Ruby gem and&nbsp;serve&nbsp;it to your application.

          Dependencies are handled the&nbsp;same way&nbsp;recursively.

      .grid__cell.unit-1-2
        = render 'shared/diff_gemfile'
    .grid.grid--line
      .grid__cell.unit-1-2.content
        markdown:
          ## Asset pipeline

          You can now `require BOWER_PACKAGE_NAME` in your stylesheets and JavaScript files—all assets exposed as&nbsp;`main` in `bower.json` will be automatically&nbsp;included.

          Gems created by Rails Assets work great with any Sprockets-based application.

      .grid__cell.unit-1-2
        = render 'shared/diff_javascript'
        = render 'shared/diff_stylesheet'
